<template>
  <div>
    <div id="yjDomBox">
      <ul class="yjList">
        <li class="clearfix" v-for="(item,index) in list" :key="index">
          <div class="yjListLeft">
            <img
              data-id="1121673"
              :src="item.article.headerimgurl"
              data-original-background="none"
              style="background: none;"
            />
            <!-- <span class="jingpin">精品</span> -->
          </div>
          <div class="yjListRight">
            <p
              @click="handleArtcile(item,index)"
              class="yjTitle"
              data-id="1121673"
            >{{item.article.title}}</p>
            <p
              @click="handleArtcile(item,index)"
              class="yjInfo"
              data-id="1121673"
            >{{item.article.intro}}...</p>
            <div class="yjBottom clearfix">
              <a
                class="leftUserBox"
                href="/travels/member/person.html?uid=cca485003bdf3cb0227d6e364aada8a2"
                target="_blank"
              >
                <span class="leftUserPic">
                  <img :src="'http://localhost:8010/getImage?name='+item.user.avataurl" />
                </span>
                <span class="leftUserName">{{item.user.nickname}}</span>
              </a>
              <div class="leftNub">
                <span class="viewNub">{{item.article.seetimes}}</span>
              </div>
            </div>
          </div>
          <div class="right" @click="deleteArtcile(item)">删除</div>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
export default {
  layout: "admin",
  data() {
    return {
      list: []
    };
  },
  created() {
    this.refresh();
  },
  methods: {
    handleArtcile(item, index) {
      window.console.log(item);
      this.$store.commit("commons/setArticleId", item.article.id);
      this.$router.push("/strategy/page");
    },
    refresh() {
      this.$axios.get("/api2/article/list/new?start=0").then(res => {
        this.list = res.data.list;
      });
    },
    deleteArtcile(item) {
      this.$axios.get("/api2/article/delete/" + item.article.id).then(res => {
        this.$message.success("删除成功");
        this.refresh();
      });
    }
  }
};
</script>

<style lang="less" scoped>
@import url(../../assets/css/home.css);
ul {
  list-style-type: none;
}

.clearfix {
  background: white;
  margin-bottom: 10px;
}
.right {
  float: right;
  width: 150px;
  text-align: center;
  line-height: 150px;
}
.right:hover {
  cursor: pointer;
  background: rgb(207, 207, 207);
}
li:hover {
  cursor: pointer;
  background: rgb(207, 207, 207);
  .yjBottom {
    background: #f8f8f8;
  }
}
#yjDomBox {
  margin: 0 auto;
}
</style>